<script src="./script.js"></script>
<style src="./style.css"></style>
<template>
  <div class="app-container">

    <div class="filter-container">

      <el-select v-model="listQuery.salesman" placeholder="请选择业务员" class="filter-item" style="width: 130px">
        <el-option v-for="item in sales_options" :key="item.value" :label="item.label" :value="item.value" />
      </el-select>

      <el-date-picker
        v-model="datetime"
        range-separator="至"
        start-placeholder="开始时间"
        end-placeholder="结束时间"
        type="daterange"
        :picker-options="pickerOptions"
        :default-time="['00:00:00']"
        value-format="yyyy-MM-dd"
        class="filter-item"
      />

      <el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-search" @click="handleSearch">查询</el-button>

    </div>

    <el-table
      v-loading="listLoading"
      :data="list"
      border
      fit
      highlight-current-row
      size="mini"
      style="width: 100%;"
    >
      <el-table-column label="业务员">
        <template slot-scope="{row}">
          {{ row.nick_name }}
        </template>
      </el-table-column>

      <el-table-column label="完成订单" prop="finished_order_num" width="70" />

      <el-table-column label="完成订单金额" prop="finished_order_amount" width="70"></el-table-column>

      <el-table-column label="入账业绩" prop="finished_order_performance" width="70"></el-table-column>

      <el-table-column label="累计返佣" prop="commission_num" width="70"></el-table-column>

      <el-table-column label="返佣总额" prop="commission_amount" width="70"></el-table-column>

      <el-table-column label="新增订单" prop="growth_order_count" width="70"></el-table-column>

      <el-table-column label="核销优惠券" prop="total_coupon_count" width="70"></el-table-column>

      <el-table-column label="核销总额" prop="total_coupon_amount" width="70"></el-table-column>

      <el-table-column label="新增订单金额" prop="growth_order_amount" width="70"></el-table-column>

      <el-table-column label="增长业绩" prop="growth_performance" width="70"></el-table-column>

      <el-table-column label="新增流量" width="70">
        <template slot-scope="{row}">
          <el-link type="danger"> {{ row.added_user_num }} </el-link>
        </template>
      </el-table-column>

      <el-table-column label="认证通过" width="70">
        <template slot-scope="{row}">
          <el-link type="danger"> {{ row.added_certification_num }} </el-link>
        </template>
      </el-table-column>

      <el-table-column label="转化下单" width="70" color="red">
        <template slot-scope="{row}">
          <el-link type="danger"> {{ row.user_coversion }} </el-link>
        </template>
      </el-table-column>

      <el-table-column label="首次下单" prop="total_first_order_count" width="70"></el-table-column>

      <el-table-column label="直接客户" prop="added_direct_num" width="70"></el-table-column>

      <el-table-column label="间接客户" prop="added_indirect_num" width="70"></el-table-column>

      <el-table-column label="充值订单" prop="added_recharge_num" width="70"></el-table-column>

      <el-table-column label="充值金额" prop="added_recharge_amount" width="70"></el-table-column>

      <el-table-column label="活跃客户" prop="purchase_num" width="70"></el-table-column>

      <el-table-column label="复购客户" prop="repurchase_num" width="70"></el-table-column>


    </el-table>

    <div style="color:#909399;font-size:14px;margin-top:10px;">
      <div>1. 新增订单：已付款订单</div>
      <div>2. 活跃客户：时间窗口内至少采购1单</div>
      <div>3. 复购客户：时间窗口内采购大于等于2单单</div>
    </div>

  </div>
</template>
